<%--
  Created by IntelliJ IDEA.
  User: student
  Date: 2019/9/20
  Time: 15:10
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basepath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html>
<head>
    <title>Title</title>
    <base href="<%=basepath %>"/>
    <link rel="stylesheet" href="layui/css/layui.css">
    <style>
        body {
            padding: 10px;
            margin-right: 10px;
        }
    </style>
</head>
<body>
    用户列表   <a class="layui-btn layui-btn-normal" href="user/toadd">新增用户</a>
    <table id="demo" lay-filter="test"></table>


<script src="layui/layui.all.js"></script>
<script>
    layui.use(['table','jquery'], function(table,$){
        var table = layui.table;
        //第一个实例
        table.render({
            elem: '#demo'
            ,height: 312
            ,url: 'user/list' //数据接口
            ,cols: [[ //表头
                {field: 'id', title: '编号', width:180}
                ,{field: 'username', title: '用户名', width:180}
                ,{field: 'password', title: '密码'}
                ,{field: 'gender', title: '性别',  sort: true}
                ,{field: 'grade.gname', title: '年级', templet: function(d){
                        return d.grade.gname
                    }}
                ,{field: 'photo', title: '照片'}
            ]],
            parseData: function(res) { //res 即为原始返回的数据
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": res.data //解析数据列表
                };
            }
            ,page: true
        });
    });
</script>
</body>
</html>
